<template>
	<view class="page">
		<view class="head">
			<view class="head-img">
				<image src="../../../../static/jiaotou1.png" @click="gotoPage('/pages/user/updateinfo/updateinfo')">
				</image>
			</view>
			<view class="title">更换手机号</view>
		</view>
		<view class="content">
			<view class="portrait">
				<image src="../../../../static/phone2.png"></image>
			</view>
			<text>当前手机号:{{mobile}}</text>
			<text class="hint">修改之后,您当前账号中的行程信息、个人资产不变</text>
		</view>
		<view class="content2">
			<view class="new_phone">
				<text>手机号:</text>
				<view class="prime">
					<input type="number" v-model="newmobile" placeholder="请输入新的手机号" />
				</view>
			</view>
			<view class="code">
				<text>验证码:</text>
				<input class="" type="number" v-model="code" placeholder="输入验证码" />
				<button class="get-code-btn" type="default" @click="sendCode">{{ send_btn_txt }}</button>

			</view>
		</view>
		<!-- <view class="developing" v-if="developing">
			正在开发当中，请尽情期待... ...
		</view> -->
		<!-- <view class="closeIntegral" @click="closeIntegral()" v-if="developing">确定</view> -->
		<button class="submit" @click="doSubmit">提交</button>
		<!-- <button class="submit" @click="showIntegral">提交</button> -->
		<view class="success" v-show="isShow">
			<view class="success-con">
				<view class="success-image">
					<image src="../../../../static/phone2.png"></image>
				</view>
				<view class="success-item">
					更换成功！<br />请使用新手机号码进行登录
				</view>
			</view>
			<!-- <button class="goto" @click="showIntegral">去登录</button> -->
			<button class="goto" @click="gotoPage('/pages/login/weblogin')">去登录</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userinfo: '',
				mobile: '',
				newmobile: '',
				send_btn_txt: '获取验证码',
				code: '',
				second: 60,
				/*是否已发验证码*/
				is_send: false,
				updateinfo_portrait: '', //头像
				isShow:false,
				developing:false,
				timer:null,
			};
		},
		onShow() {
			this.getData();
		},
		methods: {
			// closeIntegral() {
			// 	this.developing = false
			// 	if (this.timer) {
			// 		clearTimeout(this.timer);
			// 		this.timer = null;
			// 	}
			// },
			// showIntegral() {
			// 	this.developing = true;
			// 	this.timer = setTimeout(() => {
			// 		this.developing = false
			// 	}, 3000);
			// },
			/* 获取数据 */
			getData() {
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('user.index/setting', {}, function(res) {
					self.updateinfo_portrait = res.data.userInfo.avatarUrl;
					self.mobile = res.data.userInfo.mobile;
					//self.loadding = false;
					uni.hideLoading();
				});
			},
			/*发送短信*/
			sendCode() {
				let self = this;

				if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.newmobile)) {
					uni.showToast({
						title: '手机有误,请重填！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				
				self._post(
					'user.userweb/sendCode', {
						mobile: self.newmobile,
						type:'change'
					},
					result => {
						if (result.code == 1) {
							uni.showToast({
								title: '发送成功'
							});
							self.is_send = true;
							self.changeMsg();
						}
					}
				);
			},

			/*改变发送验证码按钮文本*/
			changeMsg() {
				if (this.second > 0) {
					this.send_btn_txt = this.second + '秒';
					this.second--;
					setTimeout(this.changeMsg, 1000);
				} else {
					this.send_btn_txt = '获取验证码';
					this.second = 60;
					this.is_send = false;
				}
			},
			doSubmit() {
				let self = this;
				let doupdate = {};
				
				if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.newmobile)) {
					uni.showToast({
						title: '手机有误,请重填！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				if (self.newmobile == '') {
					uni.showToast({
						title: '验证码不能为空！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				//doupdate.updateinfo_portrait = self.updateinfo_portrait;
				doupdate.mobile = self.newmobile;
				doupdate.code = self.code;
				console.log(doupdate);
				if (doupdate != '') {
					self._post(
						'user.index/bindMobile',
						doupdate,
						result => {
							if (result.code == 1) {
								uni.showLoading({
									title: '成功！',
									duration: 2000,
									icon: 'none'
								});
								// uni.showModal({
								// 	title:'更换成功，请重新登录！',
								// 	success:function(res){
								// 		if(res.confirm){
								// 			self.gotoPage('/pages/login/weblogin');
								// 		}
								// 	}
								// });
								uni.removeStorageSync('token');
								uni.removeStorageSync('user_id');
								// 执行回调函数
								uni.navigateBack();
								//self.gotoPage('/pages/login/weblogin');
							}
						},
						false,
						() => {
							uni.hideLoading();
						}
					)
				}
			},
		}
	}
</script>

<style lang="scss">
	@import 'updateinfo_phone.scss';
</style>
